<template>
    <div class="common-diary">
        <div class="inner">
            <CheckboxGroup v-model="checkid" @on-change="checkAllGroupChange">
                <ul>
                    <li class="out-list clearfix" v-for="(i,k) in list" :key="k">
                        <Checkbox :label="i.id">
                            <span class="title" >{{i.name}}<span class="pink">评论 <Badge :count="i.count"></Badge></span></span>
                        </Checkbox>
                        <div class="clearfix" >
                            <span style="display:block;margin-top: 10px;width: 30%;float: left">发布时间：{{i.addtime |formatDate }}</span>
                            <div class="btn-box float-right">
                                <span class="btn" @click="chakan(i.id)">查看</span>
                                <span class="btn" @click="delet(i.id)">删除</span>
                            </div>
                        </div>
                    </li>
                </ul>
            </CheckboxGroup>
            <div style="padding-top: 20px">
                <Checkbox class="list-top"
                          :indeterminate="indeterminate"
                          :value="checkAll"
                          @click.prevent.native="handleCheckAll">全选
                </Checkbox>
                <span @click="deletlist" style="padding: 5px 12px;color: #FE5371;border: 1px solid #FE5371;margin-left: 10px;cursor: pointer">删除</span>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "CommonItem",
        props: ['list'],
        data () {
            return {
                checkAllGroup: [],
                checkid:[],
                indeterminate: true,
                checkAll: false,
                id:[],
                ids:'',
                date:''
            }
        },
        created (){
            this.getinfo()
        },
        filters:{
            formatDate:function(time){
                var date = new Date(time * 1000);
                var Y = date.getFullYear() + '-';
                var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
                var D = date.getDate() + ' ';
                var h = date.getHours() + ':';
                var m = date.getMinutes() + ':';
                var s = date.getSeconds();
                return Y+M+D+h+m+s;
            },
        },
        methods :{
            chakan (id) {
               this.$router.push({path:'/my/mydiary/commentdetails',query:{id:id}})
            },
            deletlist () {
                let _this = this
                _this.ids= _this.checkid.join(',');
                _this.$post('/api/Diary/DelDiaryEvaluate',
                    {
                        diary_ids:_this.ids,
                    },function (res) {
                        _this.$message.success(res.msg);
                        _this.$emit('clickSearch',1)
                    },function (err,errmsg,errcode) {
                        _this.$message.error(errmsg);
                    }
                )
            },
            getinfo(){
                let _this = this
                _this.list.forEach(function (i) {
                    _this.id.push(i.id)
                })

            },
            handleCheckAll () {
                console.log(this.indeterminate)
                if (this.indeterminate) {
                    console.log(111)
                    this.checkAll = true;
                } else {
                    this.checkAll = !this.checkAll;
                }
                this.indeterminate = false;

                if (this.checkAll) {
                    this.checkid =this.id;
                } else {
                    this.checkid = [];
                }
            },
            checkAllGroupChange (data) {
                console.log(data)
                if (this.checkid.length === this.list.length) {
                    this.indeterminate = false;
                    this.checkAll = true;
                } else if (data.length > 0) {
                    this.indeterminate = false;
                    this.checkAll = false;
                } else {
                    this.indeterminate = false;
                    this.checkAll = false;
                }
            },
            delet (id) {
                let _this = this
                _this.$post('/api/Diary/DelDiaryEvaluate',
                    {
                        diary_ids:id,
                    },function (res) {
                        _this.$message.success(res.msg);
                        _this.$emit('clickSearch',1)
                    },function (err,errmsg,errcode) {
                        _this.$message.error(errmsg);
                    }
                )
            }
        }
    }
</script>

<style  lang="less" scoped>
    @import "../../style/style.less";
    .common-diary{
        background-color: #fff;
        padding: 11px 0;
        .inner {
            padding-bottom: 10px;
            .title {
                font-size: 14px;
                font-weight: bold;
            }
        }
        .btn-box {
            text-align: right;
            .btn {
                display: inline-block;
                color: @theme-color;
                border: 1px solid @theme-color;
                font-size: 14px;
                height: 28px;
                line-height: 28px;
                padding: 0 18px;
                margin-right: 16px;
                border-radius: 4px;
                cursor: pointer;
            }
        }
        .out-list{
            border-bottom: 1px dashed #e0e0e0;
            padding-bottom: 20px;
            padding-top: 20px;
        }
    }
</style>